<template>
<div class="wrap">
    <el-col :span="16" :offset="4"><el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
  <el-menu-item index="1">博客主页</el-menu-item>
  <el-submenu index="2">
    <template slot="title">板块分类</template>
    <el-menu-item index="2-1"  v-for="(value,key) in groups" :key="key" @click="$router.push('/Detail')">{{key}}</el-menu-item>
  </el-submenu>
  <el-menu-item index="3"><a href="#" target="_blank" @click="$router.push('/Blogs')">我的博客</a></el-menu-item>
</el-menu>
    </el-col>
</div>
</template>

<script>
    export default { 
        props: {
            groups: Object
        },
        name: "navUp.vue",
        data() {
            return {
                  activeIndex: '1'
            }
        },
        methods: {
        handleSelect(key, keyPath) {
            console.log(key, keyPath);
        },
        init () {
            const _this = this
            _this.$axios.get("/blogs?currentPage=" + 1).then(res => {
                res = res.data.data
                console.log("res",res)
            })
            }
            
        },
      mounted() {
          this.init()
        }
    }
</script>

<style scoped>
</style>